<!DOCTYPE html>
<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <style type="text/css">
            *{
                margin: 0;padding: 0;box-sizing: border-box;
            }
            @font-face{
                src: url("public/fonts/UVFFuturaLT.ttf");
                font-family: 'UVFFututaLT';
            }
            body{
                background: url('public/images/bg.png');
            }
            #content_tvshow {
                color: #6b4114;
                line-height: 23px;
                font-size: 18px;
                box-sizing: border-box;
                font-family: 'UVFFututaLT';
                width: 90%;
                margin:40px auto;
            }
            #content_tvshow .Cover {
                padding: 5px;
                background: #fff;
                margin-bottom: 36px;
                display: block!important;
            }
            #content_tvshow .Cover img {
                width: 100%;
            }
            #content_tvshow .Question {
                margin: 0px 0px 25px;
                box-sizing: border-box;
            }
            #content_tvshow .Choices, #content_tvshow .Statistic {
                float: left;
                width: 50%;
                padding: 20px 15px 0px 0px;
                box-sizing: border-box;
            }
            #content_tvshow .Choices li, #content_tvshow .Statistic li {
                position: relative;
                padding: 10px 10px 10px 50px;
                margin: 0px 0px 20px;
                list-style: none;
                border-radius: 3px;
                box-shadow: rgba(0, 0, 0, 0.29804) 0px 1px 1px;
                box-sizing: border-box;
                background: white;
            }
            #content_tvshow .Choices li label, #content_tvshow .Statistic li label {
                display: inline-block;
                position: absolute;
                top: 0px;
                left: 0px;
                bottom: 0px;
                width: 37px;
                text-align: center;
                padding: 10px;
                border-radius: 3px 0px 0px 3px;
                color: white;
                text-shadow: rgba(0, 0, 0, 0.29804) 0px 1px 1px;
                box-shadow: rgba(0, 0, 0, 0.29804) 1px 1px 1px;
                box-sizing: border-box;
                background: -webkit-linear-gradient(#fef27a, #ffc71c);
                background: -moz-linear-gradient(#fef27a, #ffc71c);
                background: -o-linear-gradient(#fef27a, #ffc71c);
                background: -ms-linear-gradient(#fef27a, #ffc71c);
                background: linear-gradient(#fef27a, #ffc71c);
            }
            #content_tvshow .Choices li.Answer:hover, #content_tvshow .Statistic li.Answer:hover {
                background: #ddd;
                text-shadow: 0px 1px 0px #fff;
            }
            #content_tvshow .Choices li.Answer, #content_tvshow .Statistic li.Answer {
                cursor: pointer;
            }
            #content_tvshow .Choices li.Answer.selected label, #content_tvshow .Statistic li.Answer.selected label {
                background: #E31C05;
            }
            #content_tvshow .Choices li.Answer.exactly, #content_tvshow .Statistic li.Answer.exactly {
                background: #BBFFBB !important;
            }
            #content_tvshow .Choices li.Answer.exactly label, #content_tvshow .Statistic li.Answer.exactly label {
                background: #009600 !important;
            }
            #content_tvshow .Statistic {
                padding: 20px 20px 0px;
                background: rgba(0, 0, 0, 0.49804);
            }
            #content_tvshow .Statistic li {
                position: relative;
                padding: 0px 0px 0px 37px;
                margin: 0px 0px 20px;
                background: none;
                box-shadow: none;
            }
            #content_tvshow .Statistic li div {
                height: 100%;
                padding: 10px;
                color: #6c4212;
                border-radius: 0px 3px 3px 0px;
                box-sizing: border-box;
                background: white;
                box-shadow: rgba(0, 0, 0, 0.29804) 0px 1px 1px;
                min-width: 9%;
                text-align: right;
                -webkit-transition: 0.4s;
                -moz-transition: 0.4s;
                -o-transition: 0.4s;
                transition: 0.4s;
            }

            #content_tvshow.iy7cd .Statistic {
                display: none;
            }
            #content_tvshow.iy7cd .Choices {
                width: 70%;
                margin: auto;
                float: none;
            }
        </style>
        <div id="content_tvshow" class="clearfix iy7cd" style="display: block;">
            <div class="Cover" style="display: none">
                <img style="width: 100%" src="http://125.212.192.114/VTVDEV/data/images/background/201412-slides-14190751683124.jpg" alt="">
            </div>
            <div class="Navigator">
                <a href="#" class="btnStatistic"></a>
                <a href="#" class="btnBack"></a>
            </div>
            <div class="Question">Theo bạn giàn khoan Hải Dương 981 là cách đánh lạc hướng để Trung Quốc thay đổi nguyên trạng đảo chữ Thập hay không?</div>
            <div class="Wrapp">
                <div class="Choices"><li id="answerid_1" class="Answer choice-1  selected" data-id="1"><label>1</label><span class="content">Có</span></li><li id="answerid_2" class="Answer choice-2  exactly wobble animated" data-id="2"><label>2</label><span class="content">Không</span></li></div>
            </div>
        </div>
    </body>
</html>
